Javascript-Tratando Teclado

Pra que tratar o teclado ?

Muitas vezes precisamos verificar algumas condições para que o cliente não ligue para gente brigando que o site não está funcionando.

Uma delas, com certeza, é a falta de indicação da tecla Caps-Lock (Maiúsculas) pressionada em campos tipo senha onde os caracteres pressionados são escondidos por default.

Se não houver uma indicação clara desta situação isto poderá dar dor de cabeça para os administradores do site além de embaraçar o usuário mais inexperiente.

Vamos fazer um teste

Abaixo temos um campo texto com o tratamento do evento: onkeypress="statusteclado(event);"

e abaixo temos o que a rotina statusteclado() consegue nos dizer sobre as condições do teclado

------------------> Linha de informação sobre a tecla pressionada <---------------------


Dica

Os eventos determinam qual o código da tecla. Por exemplo, nos eventos onKeyUp e onKeyDown ao pressionar a tecla A eu só recebo o código 65. Já no evento onKeyPress a tecla a tem seu código modificado pelo CapsLock, ou seja, para A recebo o código 65 e para a letra a recebo o código 97.

Análise

O teclado trabalha com um conjunto de teclas que definem a tecla pressionada.
Por exemplo, se pressionar a tecla a recebo como eco a letra a.
Mas se eu pressionar a letra a em conjunto com a tecla 'Shit'(Maiúsculas) terei como eco a letra A.
Se eu selecionar a tecla 'fixa maiúsculas' teremos mais uma tecla interagindo com o eco da tecla recebido. Resumindo, temos a tabela:

Fixa Maiúsculas Shift Resultado
OFF OFF minúsculas
OFF ON maiúsculas
ON OFF maiúsculas
ON ON minúsculas

Tecla Control

A tecla control tem um tratamento diferenciado.
Enquanto a tecla shift e 'Fixa maiúsculas' só interferem no código da tecla digitada a tecla 'Control' é interpretada pelo browser ou mesmo pelo sistema operacional onde o browser está rodando.

Experimente digita alguns caracteres no campo acima e a seguir pressione as teclas 'Control' e 'A' conjuntamente. O browser irá selecionar todo o conteúdo do campo, isso é o defalt do browser e do sistema operacional. O mesmo ocorre com as teclas Control+Z (Undo), Control+End, Control+Home entre outras.

Tecla ALT

A tecla ALT é muito pouco utilizada mas ela interfere no código do caractere recebido. Ao pressionarmos uma tecla recebemos o código da tecla. Ao pressionar a tecla ALT mais a tecla recebemos o mesmo código de tecla mas ela (a tecla) não é incorporada ao textbox, seu conteúdo é ignorado pelo controle.

Em detalhes


Eventos disparados pelo teclado
Evento: keydown keypress keyup
keyCode
charCode
Character
Shift
Ctrl
Alt
Meta